<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>课程详情 | 学生成绩管理系统</title>
  <style>
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }

    body {
      background-color: #f5f7fa;
      color: #333;
      line-height: 1.6;
      padding: 20px;
    }

    .container {
      max-width: 800px;
      margin: 30px auto;
      background: white;
      border-radius: 10px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
      padding: 40px;
    }

    h1 {
      text-align: center;
      color: #2c3e50;
      margin-bottom: 30px;
      padding-bottom: 15px;
      border-bottom: 2px solid #f0f0f0;
    }

    .course-info {
      margin: 30px 0;
    }

    .info-item {
      display: flex;
      margin-bottom: 20px;
      padding: 15px;
      background-color: #f9f9f9;
      border-radius: 6px;
      transition: all 0.3s ease;
    }

    .info-item:hover {
      background-color: #f0f7ff;
    }

    .info-label {
      font-weight: bold;
      width: 150px;
    }

    /* 添加返回按钮样式 - 与其他页面一致 */
    .action-btn {
      display: inline-block;
      background-color: #3498db;
      color: white;
      text-decoration: none;
      padding: 12px 25px;
      border-radius: 6px;
      font-weight: 500;
      transition: all 0.3s ease;
      margin-top: 20px;
      border: none;
      cursor: pointer;
      text-align: center;
    }

    .action-btn:hover {
      background-color: #2980b9;
      transform: translateY(-2px);
      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    }

    /* 添加Font Awesome图标库 */
    .action-btn i {
      margin-right: 8px;
    }
  </style>
  <!-- 添加Font Awesome图标库 -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
</head>
<body>
<!-- 添加登录验证 -->
<div th:if="${session.currentUser == null}">
  <script>
    window.location.href = "/login";
  </script>
</div>

<div class="container">
  <div class="header">
    <div>
      <h1>学生成绩管理系统</h1>
      <p style="color: #7f8c8d; font-size: 14px; margin-top: 5px;">
        欢迎，<span th:text="${session.currentUser.name}"></span>
      </p>
    </div>
    <div>
      <a href="/students" class="action-btn">
        <i class="fas fa-home"></i> 返回主界面
      </a>
      <a href="/logout" class="action-btn" style="background-color: #7f8c8d; margin-left: 10px;">
        <i class="fas fa-sign-out-alt"></i> 登出
      </a>
    </div>
  </div>

  <h1>课程详情</h1>
  <div class="course-info">
    <div class="info-item">
      <span class="info-label">课程编号:</span>
      <span th:text="${course.courseID}"></span>
    </div>
    <div class="info-item">
      <span class="info-label">课程名称:</span>
      <span th:text="${course.coursename}"></span>
    </div>
    <div class="info-item">
      <span class="info-label">学分:</span>
      <span th:text="${course.credit}"></span>
    </div>
    <div class="info-item">
      <span class="info-label">讲师:</span>
      <span th:text="${course.lecture}"></span>
    </div>
  </div>
  <h2>讲师信息</h2>
  <div class="teacher-info">
    <div class="info-item">
      <span class="info-label">讲师姓名:</span>
      <span th:text="${teacher.teachername}"></span>
    </div>
    <div class="info-item">
      <span class="info-label">职称:</span>
      <span th:text="${teacher.position}"></span>
    </div>
    <div class="info-item">
      <span class="info-label">所属院系:</span>
      <span th:text="${teacher.dept}"></span>
    </div>
  </div>
  <!-- 修改后的返回按钮 -->
  <a th:href="@{/scores/{studentId}(studentId=${param.studentId})}" class="action-btn">
    <i class="fas fa-arrow-left"></i> 返回成绩界面
  </a>
</div>
</body>
</html>